<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>用户列表</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
  </head>
  <body>
    <h1 style="text-align: center;" >用户列表</h1>
    <input type="button" class="btn btn-outline-secondary" value="增加用户" onclick="addUserView()" />
    <div class="input-group mb-3">
      <input type="text" class="form-control" placeholder="请输入关键字" name="keyWord" value="{{keyWord}}">
      <button class="btn btn-outline-secondary" type="button" id="button-addon2"  onclick="query()">搜索</button>
    </div>
    <table class="table">
      <thead>
        <tr>
          <th scope="col">ID</th>
          <th scope="col">姓名</th>
          <th scope="col">年龄</th>
          <th scope="col">操作</th>
        </tr>
      </thead>
      <tbody>
        {%for user in users%}
        <tr id="id">
          <th scope="col">{{user.uId}}</td>
          <td>{{user.uName}}</td>
          <td>{{user.uAge}}</td>
          <td>
            <input type="button" class="btn btn-info" value="编辑" onclick="edit('{{user.uId}}')" />
            <input type="button" class="btn btn-info" value="删除" onclick="del('{{user.uId}}')" />
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>

    <script src="../js/axios.min.js"></script>
    <script src="./js/user.js"></script>
    <script src="./js/bootstrap.bundle.min.js"></script>
  </body>
</html>
